<template>
    <div class="Mybey">
        <header class="mui-bar mui-bar-nav">
            <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
            <h1 class="mui-title" style="color:#141414">手机绑定</h1>
        </header>
        <div class="GoldNumber">
            手机号 <input type="text" placeholder="请输入手机号">
        </div>
         <div class="b1order"></div>
        <div class="GoldNumber">
            验证码 <input type="text" placeholder="请输入手机验证码">
            <span  class="yanzhengma">获得验证码  </span>
        </div>
        <div class="btn">
            <mt-button size="large" type="danger" @click="purchase()">确认绑定</mt-button>
        </div>
    </div>
</template>
<script>
import { MessageBox } from "mint-ui";
export default {
    data() {
        return {
            is: 1
        };
    },
    methods: {
        purchase: function() {
            console.log(1)
        }
    }
};
</script>
<style lang="scss" scoped>
.Mybey {
    .mint-msgbox-wrapper {
        .mint-msgbox {
            height: 3.1rem;
            width: 5.44rem;
            border-radius: 10px;
            line-height: 2.1rem;
            text-align: center;

            .box {
                .title {
                    font-family: PingFangSC-Regular;
                    font-size: 0.34rem;
                }
                .btn{
                    margin: 0 auto;
                    width: 80%;
                }
            }
        }
    }
    padding-top: 40px;

    .GoldNumber {
        height: 1rem;
        background: #fff;
        padding-left: 0.3rem;
        line-height: 1rem;
        font-size: 0.28rem;
        position: relative;
        input {
            border: none;
            width: 3.5rem;
                   font-size: 0.28rem;
        }
        .yanzhengma{
            font-size: 0.24rem;
            color:#d51313;
        
         
        }
    }
    .background{
        background:#e0e0e0
    }
    .btn {
        padding: 0 0.5rem;
        margin-top: 0.78rem;
    }
}
</style>    
